<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/view/include/taglib.jsp"%>
<html lang="cn" class="app">
<head>
    <meta charset="utf-8" />
    <title>${dict:getConfigValueByKey('WEB_NAME','管理平台')} | 权限管理</title>
    <meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <link rel="icon" type="image/png" href="icon.png">
    <link rel="apple-touch-icon-precomposed" href="icon.png">
    <link rel="stylesheet" href="${ctxStatic}/css/bootstrap.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/css/app.css" type="text/css" />
    <link rel="stylesheet" href="${ctxStatic}/js/ztree/css/zTreeStyle.css">
    <%--<link rel="stylesheet" href="${ctxStatic}/js/page/paging.css" type="text/css" />--%>
    <!--[if lt IE 9]>
    <script src="${ctxStatic}/js/ie/html5shiv.js"></script>
    <script src="${ctxStatic}/js/ie/respond.min.js"></script>
    <script src="${ctxStatic}/js/ie/excanvas.js"></script>
    <![endif]-->
</head>
<body>
<section class="scrollable wrapper">
    <div class="row">
        <div class="col-lg-12">
            <!-- 引导开始 -->
            <ul class="breadcrumb">
                <li><a href="${ctx}/welcome"><i class="fa fa-home"></i> 主页</a></li>
                <li>系统设置</li>
                <li class="active">权限管理</li>
                <li class="active">权限新增</li>
            </ul>
            <!-- 引导结束 -->
        </div>
    </div>
    <form id="submitForm" class="bs-example form-horizontal" method="post" >

        <%--基本信息--%>
        <section class="panel panel-default">
            <header class="panel-heading font-bold">权限新增</header>
            <input type="hidden" id="parentId" name="parentId" value="" />
            <input type="hidden" id="parentIds" name="parentIds" value="" />
            <div class="panel-body">
                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label"><span class="text-danger">*</span>上级权限：</label>
                    <div class="col-lg-2 col-md-2 col-sm-2 ">
                        <input type="text" class="form-control" id="parentName" minlength="1" value="" readonly>
                    </div>
                    <div class="col-lg-2 col-md-2 col-sm-2">
                        <button id="menuBtn" onclick="showMenu()" type="button" class="btn btn-s-md btn-default" style="float: right">选择</button>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label"><span class="text-danger">*</span>权限名称：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <input type="text" id="name" name="name" class="form-control" placeholder="权限名称（必填）" value="" required>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label">序号：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <input type="number" name="sort" class="form-control" placeholder="排序（必填）" value="1" required>
                    </div>
                </div>


                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label"><span class="text-danger">*</span>类型：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <select id="type" name="type" class="form-control" >
                            <c:forEach items="${types}" var="m">
                                <option value="${m}">${m.info}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label">图标：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <input type="text" id="icon" name="icon" class="form-control" placeholder="图标" value="" />
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label">URL路径：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <input type="text" name="url" class="form-control" value="">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label">权限字符串：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <input type="text" name="permission" class="form-control" value="">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label"><span class="text-danger">*</span>是否可用：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <select name="available" class="form-control" >
                            <c:forEach items="${yn}" var="m">
                                <option value="${m.value}" <c:if test="${resource.available==m.value}">selected="selected"</c:if>>${m.label}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label">模块：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <select name="moduleCd" class="form-control">
                            <option value="">请选择</option>
                            <c:forEach items="${dict:getDictList('DIM_SYS_MODULE')}" var="m">
                                <option value="${m.value}" <c:if test="${resource.moduleCd==m.value}">selected="selected"</c:if>>${m.label}</option>
                            </c:forEach>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-lg-2 col-md-2 col-sm-2 control-label"><span class="text-danger">*</span>目标：</label>
                    <div class="col-lg-4 col-md-4 col-sm-4">
                        <select name="target" class="form-control" >
                            <option value="_self" <c:if test="${resource.target=='_self'}">selected="selected"</c:if>>当前页</option>
                            <option value="_blank" <c:if test="${resource.target=='_blank'}">selected="selected"</c:if>>新页面</option>
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-lg-offset-2 col-md-offset-2 col-sm-offset-2 col-lg-10 col-md-10 col-sm-10">
                        <shiro:hasPermission name="sys:organization:edit">
                            <button type="button" onclick="saveInfo()" class="btn btn-s-md btn-info">保存</button>
                        </shiro:hasPermission>
                        <button type="button" class="btn btn-s-md btn-danger" onclick="closeSelfModel()">关闭</button>
                    </div>
                </div>
            </div>
        </section>
    </form>
</section>

<div id="menuContent" class="menuContent" style="display:none;position: absolute;z-index: 10000;background-color: #eee;border: 1px solid #ccc;max-height: 400px;overflow-y: auto;">
    <style>.line{height:auto;}</style><%--这个不能删除--%>
    <ul id="tree" class="ztree" style="margin-top:0;"></ul>
</div>
</body>
<script src="${ctxStatic}/js/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="${ctxStatic}/js/bootstrap.js"></script>
<!-- App -->
<script type="text/javascript" src="${ctxStatic}/js/tools.js?version=${ctxVersion}"></script>
<script type="text/javascript" src="${ctxStatic}/js/page/paging.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/layer/layer.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/tmpl/jquery.tmpl.js"></script>
<script src="${ctxStatic}/js/ztree/js/jquery.ztree.core-3.5.min.js"></script>

<script>
    $(function(){
        // 加载菜单资源树 - 菜单
        loadTree();
    })

    // 加载树
    function loadTree(){
        var setting = {
            data: {
                simpleData: {
                    enable: true
                }
            },
            callback : {
                onClick : function(event, treeId, treeNode) {
                    //点击回调方法
                    ztreeOnClickCall && ztreeOnClickCall(treeNode);
                    $("#parentName").val(treeNode.name);
                    hideMenu();
                }
            }
        };
        // 查询所有权限菜单
        $.ajax({
            type: 'get',
            url: '${ctx}/resource/getMenus.json?timeStamp='+new Date().getTime(),
            dataType:"json",
            data: {},
            success: function (data) {
                var list = data.data;
                var zNodes = [];
                for(var i=0;i<list.length;i++){
                    zNodes[i] = {
                        id: list[i].id,
                        pId: list[i].parentId,
                        name: list[i].name,
                        open: 1
                    };
                }
                $.fn.zTree.init($("#tree"), setting, zNodes);
            },error:function(){
                showMsg("点击过快或程序异常");
            }
        });
    }

    //ztree点击回调
    function ztreeOnClickCall(treeNode){
        $("#parentId").val(treeNode.id);
        $("#parentIds").val(treeNode.pIds+treeNode.id+"/");
    }

    //展示树选择区域
    function showMenu() {
        var cityObj = $("#parentName");
        var cityOffset = $("#parentName").offset();
        $("#menuContent").css({
            left: cityOffset.left + "px",
            top: cityOffset.top + cityObj.outerHeight() + "px"
        }).slideDown("fast");

        $("body").bind("mousedown", onBodyDown);
    }
    //隐藏树选择区域
    function hideMenu() {
        $("#menuContent").fadeOut("fast");
        $("body").unbind("mousedown", onBodyDown);
    }
    //点击其他区域事件-用于隐藏选择树
    function onBodyDown(event) {
        if (!(event.target.id == "menuBtn" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length > 0)) {
            hideMenu();
        }
    }

    /**保存信息 */
    function saveInfo(){
        if(isBlankCheck("parentName,name,type","上级权限,权限名称,权限类型")){
            var loadingLayer = layer.load(1, {shade: [0.1,'#fff']});//loading
            //根据项目标识获取目录
            $.ajax({
                type: 'post',
                url: '${ctx}/resource/update.json?timeStamp='+new Date().getTime(),
                dataType:"json",
                data: $("#submitForm").serialize(),
                success: function (data) {
                    layer.close(loadingLayer);
                    showMsg(data.desc);
                },error:function(){
                    layer.close(loadingLayer);
                    showMsg("点击过快或程序异常");
                }
            });
        }
    }

    /** 关闭当前弹出框并执行 */
    function closeSelfModel(){
        var index = parent.layer.getFrameIndex(window.name);
        parent.searchPage(1);//执行父页面的搜索功能
        parent.loadTree();// 执行父页面的加载权限树
        parent.layer.close(index);
    }

</script>
</html>
